<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <link rel="stylesheet" href="../css/main.css" />
    <link rel="stylesheet" href="../css/bootstrap.min.css" />
    <script src="../js/jquery.min.js"></script>
    <script src="../js/bootstrap.min.js"></script>
    <script src="../js/core-selectInput.js"></script>
</head>
<body>
<div style="width:600px;text-align:left;margin:0 auto;padding-top:80px;">
        <input type="hidden" id="dataContainer" value="" />
        <input type="text" class="form-control" id="testInput" />
</div>
</body>
<script type="text/javascript">
$(function(){
    var citys = [{value:"SHA",label:"上海",short:"ShangHai"},{value:"HYN",label:"黄岩"},{value:"HGH",label:"杭州",short:"Hangzhou"},{value:"HGH2",label:"杭州",short:"Hangzhou"},{value:"HGH3",label:"杭州",short:"Hangzhou"}];
    var options = {
        data:citys,//数据源
        placeholder:"请输入中文/缩写",//默认显示文字
        dataContainer:"dataContainer",//会将选择项的value值写到dataContainer控件，这里dataContainer是控件的ID
        onSelect:function(item){
            //选择某项后回调函数，item为选择的json对象，当数据源有多个对象需要处理时使用
            console.log(item);
        }};
    $("#testInput").selectInput(options);
    
    var citys2 = [{value:"SHA",label:"悬浮",short:"ShangHai"}];
    var options2 = {
            data:citys2,//数据源
            placeholder:"请输入中文/缩写",//默认显示文字
            dataContainer:"dataContainer",//会将选择项的value值写到dataContainer控件，这里dataContainer是控件的ID
            onSelect:function(item){
                //选择某项后回调函数，item为选择的json对象，当数据源有多个对象需要处理时使用
                console.log(item);
            }
    };
    $("#testInput").selectInput(options2);
    
});
</script>
</html>